<template>
  <div id="Detail">
    <!-- 顶部详情导航 -->
   <detail-nav-bar></detail-nav-bar>
   <!-- 详情页轮播图 -->
   <myswiper></myswiper>
   <!-- 商品基本信息 -->
   <detail-base-info :goods="goods"></detail-base-info>
   <!-- 店铺信息 -->
   <detail-shop-info :shop="shopInfo"></detail-shop-info>
   <!-- 图片展示 -->
   <detail-goods-info :detailInfo="detailInfo"></detail-goods-info>
   <!-- 尺码信息 -->
   <detail-comment-info :paramInfo="paramInfo"></detail-comment-info>
  </div>
</template>

<script>
// swiper
import Myswiper from "./childComps/myswiper.vue";

import DetailNavBar from '@/views/detail/childComps/DetailNavBar'
// 商品信息
import DetailBaseInfo from "./childComps/DetailBaseInfo.vue"
// 店铺信息
import DetailShopInfo from "./childComps/DetailShopInfo.vue"
// 图片展示
import DetailGoodsInfo from "./childComps/DetailGoodsInfo.vue"
// 尺码信息
import DetailCommentInfo from "./childComps/DetailCommentInfo.vue"
import { getDetail, Goods, GoodsParam, getRecommend } from "../../network/detail";
export default {
name:"Detail",
data() {
  return {
    goods:{},
    iid:null,
    shopInfo:{},
    detailInfo:{},
    paramInfo:{},
  }
},
components:{
    DetailNavBar,
    Myswiper,
    DetailBaseInfo,
    DetailShopInfo,
    DetailGoodsInfo,
    DetailCommentInfo,
},
created() {
  //保存传入的iid
 this.iid = this.$route.params.iid;
  // 获取详情页数据
  getDetail(this.iid).then((res)=>{
    const data=res.result;
    console.log(data);
    // 获取商品信息
    this.goods=new Goods(
      // 商品信息
      data.itemInfo,
      data.columns,
      data.shopInfo.services,
    );
    // 获取店铺信息
    this.shopInfo=data.shopInfo;
    // 获取图片信息
    this.detailInfo=data.detailInfo;
    // 获取尺码信息
    this.paramInfo=data.itemParams;
  })
},
}
</script>

<style scoped>

</style>